<template>
	<div>
    <!-- 头部 -->
    <heads></heads>
    <!-- 头部  end-->
   <!--跟进列表 -->
   <div class="sale-list">
     <div class="warp">
       <div class="sale-list-li">
         <div class="sale-list-li-left">编号</div>
         <div class="sale-list-li-input">
           <input type="text">
         </div>
       </div>
        <div class="sale-list-li">
         <div class="sale-list-li-left">分店</div>
         <div class="sale-list-li-input">
           <input type="text">
         </div>
       </div>
        <div class="sale-list-li">
         <div class="sale-list-li-left">执行人</div>
         <div class="sale-list-li-input">
           <input type="text">
         </div>
       </div>
        <div class="sale-list-li">
         <div class="sale-list-li-left">发布时间</div>
         <div class="sale-list-li-input">
           <el-date-picker style="width:90%"
      v-model="timevalue1"
      type="date"
      placeholder="选择日期">
    </el-date-picker>
         </div>
       </div>
        <div class="sale-list-li">
         <div class="sale-list-li-left sale-list-li-left1">跟进时间 <div class="line"></div></div>
         <div class="sale-list-li-input">
          <el-date-picker style="width:90%"
      v-model="timevalue2"
      type="date"
      placeholder="选择日期">
    </el-date-picker>
         </div>
       </div>
        <div class="sale-list-li">
         <div class="sale-list-li-left">是否已执行</div>
         <div class="sale-list-li-input">
           <input type="text">
         </div>
       </div>
       <div class="sale-list-li">
         <button class="sale-search">搜索</button>
       </div>
     </div>
   </div>
   <!-- 跟进列表 end-->
   <!-- 楼盘列表 -->
   <div class="sale-info">
    <table>
       <!-- 标题 end-->
       <tr class="sale-info-title">
         <td >全部</td>
         <td >客源编号</td>
         <td>发布人</td>
         <td >接受人</td>
         <td >任务内容</td>
         <td >规定最迟完成时间</td>
         <td >发布时间</td>
         <td>是否执行</td>
         <td >操作</td>
       </tr>
       <!-- 标题 end-->
       <!-- 列表循环 -->
        <tr>
        <td >全部</td>
         <td >客源编号</td>
         <td>发布人</td>
         <td >接受人</td>
         <td >任务内容</td>
         <td >规定最迟完成时间</td>
         <td >发布时间</td>
         <td>是否执行</td>
         <td><span class="edit">删除</span></td>
       </tr>
        <!-- 列表循环 end-->
     </table>
     <!-- 分页 -->
     <div class="page-list">
        <el-pagination
    layout="prev, pager, next"
    :total="1000">
  </el-pagination>
     </div>
      <!-- 分页 end-->
    </div>
   <!-- 楼盘列表 end-->
    <!-- 尾部 -->
    <footers></footers>
    <!-- 尾部 end -->
	</div>
</template>
<script type="text/babel">
import heads from './head';
import footers from './footer';
    export default {
      name:'Ktask',
       components:{
      heads,
      footers
      },
	    data () {
	      return {
          timevalue1:'',
          timevalue2:''
	}
  },
}
</script>
<style scoped>
.sale-info{
  width: 100%;
  float: left;
  position: fixed;
  top: 134px;
  height: calc(100% - 174px);
  overflow-y: auto;
}
.sale-list-li-left1{
  color: #f9f9f9;
  position: relative;
}
.sale-list-li1{
  width: 30%!important;
}
.line{
  width: 40px;
  top: 50%;
  left: 70%;
  height: 1px;
  background: #333;
  position: absolute;left: 0;
}
table{
  width: 100%;
}
table td{
  line-height: 30px;
  height: 30px;
  border:1px solid #d3d3d3;
}
.sale-list-li-left{
  width: 30%;
  float: left;
  line-height: 30px;
  text-align: center;
}
.page-list{
  width: 100%;
  float: left;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 70px;
}
.sale-list-li{
  width: 100%;
  float: left;
  margin-top:10px;
}
.sale-list-li-input{
  width:70%;
  float: left;
}
.sale-search{
  margin-left: 25px;
  background: #ed7d31;
  color: #ffffff;
   font-size: 1.1em;
  border:none;
  height: 30px;
  line-height: 30px;
  width: 60px;
  border-radius: 5px;
}
.sale-list-li-inputz input{
  width: 40%!important;
  float: left;
}
.sale-list-li-inputz input:nth-child(2){
  margin-left: 8%
}
.sale-info-title{
  background: #f9f9f9;
/*  position: fixed;*/
  width: 100%;
  overflow: hidden;
}
tr:hover{
  background: #f9f9f9
}
.sale-list-li-input input{
  width: 90%;
  float: left;
  height: 30px;
  line-height: 30px;
  border-radius: 5px;
  background: #fff;
  border:1px solid #d3d3d3;
}
	.sale-btn{
    width: 100%;
    position: fixed;
    top: 80px;
    float: left;
    background: #f9f9f9;
    border-bottom: 1px solid #d3d3d3;
    line-height: 40px;
    height: 40px;
  }
  .sale-btn button{
   margin-right: 40px;
    font-size: 1.1em;
   padding:5px 10px;
   border-radius: 5px;
   background: #ed7d31;
   color: #fff;
   border:none;
  }
  .sale-list{
     position: fixed;
     top: 80px;
     background: #f9f9f9;
     float: left;
     width: 100%;
     left: 0;
     height: 54px;
     overflow:hidden;
  }
  .sale-list-li{
    width:14.285%;
    float: left;
  }
</style>
